<header class="header">
  <div class="slimContent">
    <div class="navbar-header">
      <div class="profile-block text-center">
        <a id="avatar" href="https://github.com/cofess" target="_blank">
          <img class="thumb-xl img-circle img-rotate" src="assets/images/avatar.jpg" width="200" height="200">
        </a>
        <h2 id="name" class="hidden-xs hidden-sm">Cofess</h2>
        <h3 id="title" class="hidden-xs hidden-sm hidden-md">Web Developer &amp; Designer</h3>
        <small id="location" class="text-muted hidden-xs hidden-sm"><i class="fa fa-map-marker"></i> Shenzhen, China</small>
        <!-- <a id="follow" target="_blank" href="https://github.com/cofess">关注</a> -->
      </div>
      <div class="search">
        <form action="#" method="get" class="sidebar-form">
          <div class="input-group">
            <input type="text" name="q" class="form-control" placeholder="Search..." x-webkit-speech>
            <span class="input-group-btn">
              <button type="submit" name="search" id="search-btn" class="btn btn-flat"><i class="fa fa-search"></i></button>
            </span>
          </div>
        </form>
      </div>
      <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target="#main-navbar" aria-controls="main-navbar" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>
    <nav id="main-navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav main-nav">
        <li class="active">
          <a href="index.html"><i class="fa fa-fw fa-dashboard"></i> <span class="menu-title">Home</span></a>
        </li>
        <li>
          <a href="categories.html"><i class="fa fa-fw fa-folder"></i> <span class="menu-title">Categories</span></a>
        </li>
        <li>
          <a href="tags.html"><i class="fa fa-fw fa-tags"></i> <span class="menu-title">Tags</span></a>
        </li>
        <li>
          <a href="archives.html"><i class="fa fa-fw fa-delicious"></i> <span class="menu-title">Archives</span></a>
        </li>
        <li>
          <a href="repository.html"><i class="fa fa-fw fa-code"></i> <span class="menu-title">Repository</span></a>
        </li>
        <li>
          <a href="books.html"><i class="fa fa-fw fa-leanpub"></i> <span class="menu-title">Books</span></a>
        </li>
        <li>
          <a href="links.html"><i class="fa fa-fw fa-gg"></i> <span class="menu-title">Links</span></a>
        </li>
        <li>
          <a href="about.html"><i class="fa fa-fw fa-coffee"></i> <span class="menu-title">About</span></a>
        </li>
      </ul>
      {% include "_includes/social.html" %}
    </nav>
  </div>
</header>
